<template>
	<view>
		<view class="header-box">
			<topTabBar :tabbarTitle="'我的积分'"></topTabBar>
			<view class="header-box-1">{{userInfo.score}}</view>
			<view class="header-box-2">积分</view>
		</view>
		<noData v-if="lists.length < 1" type="1" ndText="暂无积分"></noData>
		<view class="integral-item" v-for="(item,index) in lists" :key="index">
			<view class="integral-item-left">
				<view class="name">{{item.memo}}</view>
				<view class="time">{{getTime(item.createtime)}}</view>
			</view>
			<view class="integral-item-right"><text v-show="Number(item.score) > 0">+</text>  {{item.score}}</view>
		</view>
	</view>
</template>

<script>
	import noData from '@/components/no-data.vue';
	import topTabBar from '@/components/topTabBar.vue';
	export default {
		components: {
			topTabBar,
			noData
		},
		data() {
			return {
				lists:[],
				userInfo:{}
			}
		},
		onLoad() {
			this.init()
		},
		methods: {
			init() {
				this.$http('user.getuserdetails', {}, '获取中...').then(res => {
					if (res.code == 1) {
						this.userInfo = res.data
					}
				})
				this.$http('other.getScoreLog', {}, '获取中...').then(res => {
					if (res.code == 1) {
						this.lists = res.data.data
					}
				})
			},
			getTime(timestamp) {
				let date = new Date(parseInt(timestamp) * 1000);
				let Year = date.getFullYear();
				let Moth = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
				let Day = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
				let Hour = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours());
				let Minute = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
				let Sechond = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
				return Year + '-' + Moth + '-' + Day + '   ' + Hour + ':' + Minute + ':' + Sechond;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.header-box {
		width: 100%;
		height: 235rpx;
		background-image: url('');
		background-size: contain;
		background-repeat: no-repeat;
		padding-top: 100rpx;
		position: relative;

		.header-box-1 {
			font-weight: bold;
			font-size: 48rpx;
			color: #FFFFFF;
			text-align: center;
			margin-top: 50rpx;
		}

		.header-box-2 {
			font-weight: 500;
			font-size: 28rpx;
			color: #FFFFFF;
			text-align: center;
			margin-top: 20rpx;
		}
	}
	.integral-item{
		padding: 20rpx;
		display: flex;
		justify-content: space-between;
		border-bottom: 1rpx solid #EEEEEE;
		.integral-item-left{
			.name{
				font-weight: bold;
				font-size: 28rpx;
				color: #333333;
			}
			.time{
				font-size: 24rpx;
				color: #999999;
				margin-top: 20rpx;
			}
		}
		.integral-item-right{
			font-weight: bold;
			font-size: 32rpx;
			color: #333333;
			margin-top: 20rpx;
		}
	}
</style>